import {EditableProTable} from "@ant-design/pro-table";
import {GenField} from "@/pages/system/tool/gen/type";
import {EditableProTableProps} from "@ant-design/pro-table/lib/components/EditableTable";
import {Form} from "antd";
import columns from "@/pages/system/tool/gen/detail/components/Table/config/columns";
import {useModel} from "@@/plugin-model/useModel";
import {useEffect} from "react";


export default (props: any) => {
  const [form] = Form.useForm();
  const {setGenFieldList, genFieldList} = props;
  const {javaFieldTypeList, getJavaFieldType} = useModel("javaFiledType");

  useEffect(()=>{
    getJavaFieldType()
  }, [])

  const tableProps: EditableProTableProps<any, any> = {
    rowKey: "id",
    recordCreatorProps: false,
    value: genFieldList,
    bordered: true,
    onChange: setGenFieldList,
    // @ts-ignore
    columns: columns(javaFieldTypeList),
    editableFormRef: props.editableFormRef,
    actionRef: props.actionRef,
    pagination: false,
    controlled: true,
    scroll: {
      x: 960
    },
    editable: {
      type: 'multiple',
      form,
      editableKeys: props.genFieldList?.map((item: GenField) => item.id),
    }
  }
  return (
    <EditableProTable<GenField>
      {...tableProps}
    />

  )
}
